<template>

	<z-paging auto-show-back-to-top :auto="i == index" ref="paging" v-model="dataList" :data-key="i" @query="queryList"
		:fixed="false" height="100%">

		<!-- 提交发货 -->
		<u-modal v-model="fahuoShow" @confirm="fahuoHand" asyncClose closeOnClickOverlay title="填写物流单号">
			<view class="slot-content">
				<view class="flex_box aic pa20">
					<view class="item ov"><input v-model="express_number" type="text" class="ipt_01"
							placeholder-style="color: #BBBBBB;" placeholder="请输入快递单号" /></view>
					<image @click="saohand" src="@/static/icon_saomiao.png" class="ml35 vt"
						style="width: 36rpx; height: 33rpx;"></image>
				</view>
			</view>
		</u-modal>


	
		<block class="pa30" v-for="(item, newsIndex) in dataList" :key="newsIndex">

			<view class="r_area_block_1 mb30">
				<view class="pb25"  @click="toPath('/pages/orderlist/detail?id=' + item.order_id)">
					<view class="flex_box aic">
						<view class="item">
							<view class="fs30 lh36">订单号：{{item.sn}}</view>
						</view>
						<view class="fs30 text-[#FF4907]">{{item.status_mean}}</view>
					</view>
					<view class="mt15 fs30 lh36 cor_aaa">机器数量：{{item.expect_num}}</view>
					<view class="mt15 fs30 lh36 cor_aaa">预估价格：{{item.expect_price}}</view>
					<view class="mt15 fs30 lh36 cor_aaa">下单时间：{{item.create_time}}</view>
				</view>
				<view class="pt20 r_bt1">
					<view class="df jcfe aic">
						<view v-if="item.btn.indexOf('shanchu') > -1" @click="DeleteHand(item.order_id)" class="ml12  r_btn_1">删除订单</view>
						<!-- <view v-if="item.btn.indexOf('shouhou') > -1" class="ml12  r_btn_1">申请售后</view> -->
						<view v-if="item.btn.indexOf('fahuo') > -1" @click="fahuoEnv(item.order_id,newsIndex)"
							class="ml12 r_btn_2">提交发货</view>
						<!-- <view v-if="item.btn.indexOf('chengjiao') > -1" class="ml12 r_btn_2">确认成交</view> -->
					</view>
				</view>
			</view>
			<!-- <news-card :item="newsItem" :newsId="newsItem.id"></news-card> -->
		</block>
	</z-paging>


</template>

<script lang="ts" setup>
	import { ref, watch, nextTick, shallowRef,defineEmits } from 'vue'
	import { apiList, deleteOrder, fahuo } from '@/api/order'
	
	const OrderId = ref(0);
	const newsIndex = ref(0);
	const express_number = ref('');
	const fahuoShow = ref(false);

	const current = ref<number>(0)
	
	const toPath  = (link:any) => {
		uni.navigateTo({
			url:link
		})
	}

	const emit = defineEmits(['ok'])

	const fahuoEnv = (id : any, index : any) => {
		fahuoShow.value = true;
		OrderId.value = id;
		newsIndex.value = index;
		console.log("id", id);
	}


	const saohand = () => {
		uni.scanCode({
			success: function (res) {
				express_number.value = res.result
			}
		})
	}
	
	
		
	const DeleteHand = (id:any)  => {
		uni.showModal({
			title: '提示',
			content: `确认删除该定单吗？`,
			success: function (res) {
				if (res.confirm) {
					uni.showLoading();
					deleteOrder({ id: id }).then(() => {
						uni.hideLoading();
						queryList(1, 10);
					})	
				} 
			}
		});
	}

	const fahuoHand = () => {
		uni.showLoading();
		fahuo({ id: OrderId.value, express_number: express_number.value }).then(() => {
			uni.hideLoading();
			fahuoShow.value = false;
			queryList(1, 10);
			express_number.value = "";
		}).catch(() => {
			fahuoShow.value = false;
		})
	}




	const props = withDefaults(
		defineProps<{
			cid : number
			i : number
			index : number
		}>(),
		{
			cid: 0
		}
	)













	const paging = shallowRef<any>(null)
	const dataList = ref([])
	const isFirst = ref<boolean>(true)

	watch(
		() => props.index,
		async () => {
			await nextTick()
			if (isFirst.value) {
				paging.value?.reload()
			}
		},
		{ immediate: true }
	)

	const queryList = async (page_no, page_size) => {
		try {
			const { lists } = await apiList({
				user_status: props.cid,
				page_no,
				page_size
			})
			paging.value.complete(lists)
			emit("ok")
		} catch (e) {
			console.log('报错=>', e)
			//TODO handle the exception
			paging.value.complete(false)
		}
	}
	
	queryList(1, 10);
</script>

<style scoped>
	.r_area_block_1 {
		position: relative;
		padding: 30rpx 30rpx 20rpx;
		background: #fff;
		border-radius: 10rpx;
	}
</style>